<template>
  <div class="app-container ">
    <h3>SD003Oj 销售发货</h3>

    <template v-if="false">
      <el-select v-model="selectedFileType" disabled placeholder="请选择文件类型">
        <el-option
          v-for="fileType in fileTypes"
          :key="fileType.value"
          :label="fileType.label"
          :value="fileType.value"
        />
      </el-select>

      <el-upload
        disabled
        class="upload-demo"
        action="#"
        :show-file-list="false"
        :on-change="handleChange"
      >
        <el-button slot="trigger" disabled size="small" type="primary">点击上传文件</el-button>
      </el-upload>
    </template>

    <el-table
      v-if="data.length > 0"
      :data="data"
      border
      style="width: 100%; margin-top: 20px;"
      size="medium"
    >

      <el-table-column prop="id" label="执行结果" width="50" align="center">
        <template slot-scope="scope">
          <!--          <el-link type="primary">编辑</el-link>-->
          <i class="el-icon-success" style="color: red;" />
        </template>
      </el-table-column>

      <el-table-column prop="id" label="行序号" />
      <el-table-column
        v-for="(column,index) in visibleColumns"
        :key="column.prop"
        :prop="column.prop"
        :label="`${index + 1}. ${column.label}`"
        width="180"
      />
    </el-table>
  </div>
</template>

<script>
import { fetchFileData } from '@/api/basics'

export default {
  name: 'SD003Oj',
  props: ['ppath'],
  data() {
    return {
      data: [],
      selectedFileType: '', // Selected file type
      fileTypes: [
        { label: '收货（收货指令）', value: 'receipt' },
        { label: '收货（收货结果）', value: 'receipt_result' }
        // { label: '其他文件类型', value: 'other' }
        // Add more file types as needed
      ]
    }
  },
  computed: {
    visibleColumns() {
      return [
        { prop: 'DeliveryID', label: '交货编号' },
        { prop: 'DeliveryCode', label: '交货代码' },
        { prop: 'CreateDate', label: '创建日期' },
        { prop: 'DeliveryDate', label: '计划交货日期' },
        { prop: 'MakerName', label: '创建者用户ID' },
        { prop: 'ShipFrom', label: '发货地点代码' },
        { prop: 'ShipTo', label: '收货方代码' },
        { prop: 'Carrier', label: '承运商代码' },
        { prop: 'SellerID', label: '销售公司ID' },
        { prop: 'BuyerID', label: '买方代码' },
        { prop: 'SalesRepID', label: '销售员工ID' },
        { prop: 'RefrenceNo', label: '客户采购订单号' },
        { prop: 'ShipmentTerm', label: '运输条款' },
        { prop: 'ShipmentMethod', label: '运输方式' },
        { prop: 'Comments', label: '文本-发货备注' },
        { prop: 'DateLastUpdated', label: '上次更新日期' },
        { prop: 'WarehouseID', label: '存储位置ID' },
        { prop: 'DocDate', label: '创建日期' },
        { prop: 'AddressName', label: '收货地址' },
        { prop: 'AR', label: '收货方简称' },
        { prop: 'AL1', label: '地址' },
        { prop: 'AC', label: '收货城市' },
        { prop: 'OfficePhone', label: '联系电话号码' },
        { prop: 'DepartmentName', label: '部门名称' },
        { prop: 'ContactName', label: '收货伙伴货物收据联系人' },
        { prop: 'CarrierOfficePhone', label: '承运人电话号码' },
        { prop: 'CarrieerContactName', label: '承运人联系人' },
        { prop: 'Install1', label: '安装指令1' },
        { prop: 'Install2', label: '安装指令2' },
        { prop: 'Install3', label: '安装指令3' },
        { prop: 'Install4', label: '安装指令4' },
        { prop: 'Install5', label: '安装指令5' },
        { prop: 'Install6', label: '安装指令6' },
        { prop: 'Install7', label: '安装指令7' },
        { prop: 'Install8', label: '安装指令8' },
        { prop: 'Install9', label: '安装指令9' },
        { prop: 'Install10', label: '安装指令10' },
        { prop: 'Install11', label: '安装指令11' },
        { prop: 'Install12', label: '安装指令12' },
        { prop: 'Install13', label: '安装指令13' },
        { prop: 'Install14', label: '安装指令14' },
        { prop: 'Install15', label: '安装指令15' },
        { prop: 'Reservised1', label: '保留字段1' },
        { prop: 'Reservised2', label: '保留字段2' },
        { prop: 'Reservised3', label: '保留字段3' },
        { prop: 'Reservised4', label: '保留字段4' },
        { prop: 'Reservised5', label: '保留字段5' },
        { prop: 'Fax', label: '传真号码' },
        { prop: 'ZipCode', label: '收货方邮政编码' },
        { prop: 'Auditer', label: '审核员' },
        { prop: 'DeliveryDetailID', label: '交货明细编号' },
        { prop: 'DeliveryID1', label: '交货编号（详细）' },
        { prop: 'OrderCode', label: '销售订单编号' },
        { prop: 'OrderTypeID', label: '订单原因类型ID' },
        { prop: 'PaymentMethod', label: '支付方式' },
        { prop: 'OrderDetailID', label: '销售订单行项目编号' },
        { prop: 'ItemID', label: '物料编号' },
        { prop: 'UMCode', label: '计量单位编码' },
        { prop: 'Qty', label: '数量' },
        { prop: 'BaseQty', label: '基本数量' },
        { prop: 'WarehouseID1', label: '存储位置ID（详细）' },
        { prop: 'AllocFlag', label: '分配标志' },
        { prop: 'SNMgmt', label: '序列号管理' },
        { prop: 'SerialNo', label: '序列号' },
        { prop: 'ValuationType', label: '估价类型' },
        { prop: 'MovementType', label: '移动类型' },
        { prop: 'ShippingCondition', label: '运输条件' },
        { prop: 'VendorItemCode', label: '供应商物料代码' }
      ]
    }
  },
  created() {
    this.getfetchFileData()
  },
  methods: {
    async getfetchFileData() {
      const response = await fetchFileData({
        'name': 'SD003Oj',
        'path': this.ppath
      })
      this.data = response.data
    },
    handleChange(file, fileList) {
      const reader = new FileReader()
      reader.onload = (event) => {
        const text = event.target.result.replace(/\n$/, '')

        if (this.selectedFileType === 'receipt') {
          this.parseText(text) // Call function to parse text data
        } else if (this.selectedFileType === 'receipt_result') {
          this.parseText1(text) // Call function to parse text data
        }
      }
      reader.readAsText(file.raw)
    },
    parseText1(text) {
      const lines = text.split('\n')
      const parsedData = lines.map((line, index) => {
        const fields = line.split('\t')
        return {
          id: index + 1, // Generate ID based on index (you can adjust as needed)
          ReceiptID: fields[0],
          OrgID: fields[1],
          ShipFrom: fields[2],
          ShipTo: fields[3],
          SellerID: fields[4],
          BuyerID: fields[5],
          ReceiptType: fields[6],
          ReceiptCode: fields[7],
          ReceiveDate: fields[8],
          RelatedTranType: fields[9],
          RefrenceNo: fields[10],
          Comments: fields[11],
          WareHouseID: fields[12],
          ReceiptDetailID: fields[13],
          ReceiptID1: fields[14],
          ItemID: fields[15],
          DeliveryDetailID: fields[16],
          OrderID: fields[17],
          OrderDetailID: fields[18],
          QtyShipped: fields[19],
          QtyReceived: fields[20],
          QtyInspected: fields[21],
          QtyAccepted: fields[22],
          QtyInvalid: fields[23],
          ComplaintReasonCode: fields[24],
          InvStatus: fields[25],
          Comments_UoM: fields[26],
          WarehouseID: fields[27],
          BaseQty: fields[28],
          MovementType: fields[29],
          ValuationType: fields[30]
          // InvoiceNumber: fields[31],
          // VendorItemCode: fields[32]
        }
      })
      this.data = parsedData
    },
    parseText(text) {
      const lines = text.split('\n')
      const parsedData = lines.map((line, index) => {
        const fields = line.split('\t')
        return {
          id: index + 1, // Generate ID based on index (you can adjust as needed)
          ReceiptID: fields[0],
          OrgID: fields[1],
          ShipFrom: fields[2],
          ShipTo: fields[3],
          SellerID: fields[4],
          BuyerID: fields[5],
          ReceiptType: fields[6],
          ReceiptCode: fields[7],
          ReceiveDate: fields[8],
          RelatedTranType: fields[9],
          RefrenceNo: fields[10],
          Comments: fields[11],
          WareHouseID: fields[12],
          ReceiptDetailID: fields[13],
          ReceiptID1: fields[14],
          ItemID: fields[15],
          DeliveryDetailID: fields[16],
          OrderID: fields[17],
          OrderDetailID: fields[18],
          QtyShipped: fields[19],
          QtyReceived: fields[20],
          QtyInspected: fields[21],
          QtyAccepted: fields[22],
          QtyInvalid: fields[23],
          ComplaintReasonCode: fields[24],
          InvStatus: fields[25],
          Comments_UoM: fields[26],
          WarehouseID: fields[27],
          BaseQty: fields[28],
          MovementType: fields[29],
          ValuationType: fields[30],
          InvoiceNumber: fields[31],
          VendorItemCode: fields[32]
        }
      })
      this.data = parsedData
    }
  }
}
</script>

<style scoped>
.upload-demo {
  margin-bottom: 20px;
}
</style>
